<div class="bjui-pageHeader">
    <form id="pagerForm" data-toggle="ajaxsearch" action="${request.getContextPath()}/finalPassYieldByPart/finalPassYieldByPart" method="post">
        <div class="bjui-searchBar">
            <g:hiddenField name="SYS_QUERY_NAME" value="finalPassYieldByPart" />
            <g:hiddenField name="EXPORT_CONTENT_NAME" value="Excel" />
            <label>客户：</label>
            %{--<g:select name="customerLotId" from="${customerLotIdList}" data-toggle="selectpicker" data-live-search="true"--}%
                      %{--optionKey="CUSTOMER_LOT_ID" optionValue="CUSTOMER_LOT_ID" value="${customerLotId}" data-width="130"--}%
                      %{--noSelection="['': '-- All --']"/>&nbsp;--}%
            <g:textField name="customerLotId" value="${customerLotId}" size="15" placeholder="客户" />&nbsp;
            <label >方向：</label>
            <g:select name="customerDirect" from="${partDirect}" data-toggle="selectpicker" data-live-search="true"
                      optionKey="description" optionValue="text" value="${customerDirect}" data-width="130"
                      noSelection="['':'-- All --']" />&nbsp;
            <label>客户图号：</label>
            <input type="text" name="group4" value="${group4}" size="17" placeholder="客户图号"/>&nbsp;
            <label>内部图号：</label>
            <input type="text" name="group3" value="${group3}" size="17" placeholder="内部图号"/>&nbsp;
            <label>不良类型：</label>
            <input type="text" name="defectType" value="${defectType}" size="17" placeholder="不良类型">
            <br /><br />
            <label>检查工序：</label>
            <g:select name="checkStep" from="${checkStepList}" data-toggle="selectpicker" data-live-search="true"
                      optionKey="step_name" optionValue="step_desc" value="${checkStep}" data-width="150"
                      noSelection="['':'-- All --']" />&nbsp;
            <label>送检时间<strong><span class="text-danger">*</span></strong>：</label>
            <input type="text" name="startTime" readonly value="${startTime}" data-rule="required"
                   data-pattern="yyyy-MM-dd" size="12" data-toggle="datepicker" placeholder="FROM">
            <input type="text" name="endTime" readonly value="${endTime}" data-rule="required"
                   data-pattern="yyyy-MM-dd" size="12" data-toggle="datepicker" placeholder="TO">&nbsp;
            %{--<label >大组类：</label>&nbsp;
            <input type="text" name="totalGroup" value="${totalGroup}"/>
            <label >小分类：</label>&nbsp;
            <input type="text" name="detailCate" value="${detailCate}"/>
            <label >批次号：</label>&nbsp;
            <input type="text" name="lotId" value="${lotId}"/>--}%

            <button type="submit" class="btn-default" data-icon="search">查询</button>&nbsp;
            %{--<button type="button" class="btn-blue" onclick="javascript:bjuiExportExl('#pagerForm','${request.getContextPath()}/StageWip/exportExcel')" --}%
                    %{--data-icon="file-excel-o" title="导出Excel">导出</button>--}%
            <a type="button" class="btn btn-blue" href="${request.getContextPath()}/Base/exportExcel"
               data-toggle="doexport" data-confirm-msg="确定要导出吗？" data-icon="file-excel-o" title="导出Excel">导出</a>
        </div>
    </form>
</div>

<div class="bjui-pageContent tableContent">
    <g:if test="${finalPassYieldByPart.size() > 0}">
        <div id="finalPassYieldByPartTen" style="width:100%;height:58%;" ></div>
        <script  src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script  src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data=[];
            <g:each in="${finalPassYieldByPartTen}" status="i" var="tableInstance">
            data.push('${tableInstance.PART_NAME}');
            </g:each>

            // 指定图表的配置项和数据
            option = {
                title : {
                    text: '最终合格率不良按产品',
                    x:'center'
                },
                tooltip : {
                    trigger: 'item',
                    formatter: "{c}%"
                },
                legend: {
                    orient : 'vertical',
                    x : 'left',
                    data:data
                },

                calculable : true,
                series : [
                    {
                        name:'',
                        type:'pie',
                        radius : '55%',
                        center: ['50%', '60%'],
                        data:[
                            <g:each in="${finalPassYieldByPartTen}" status="i" var="dataInsatance">
                            {value:'${dataInsatance.DEFECT_YIELD}',name:'${dataInsatance.PART_NAME}'},
                            </g:each>
                        ]
                    }
                ]
            };

            // 使用刚指定的配置项和数据显示图表
            eChartsTool.setOption("roma", document.getElementById('finalPassYieldByPartTen'), option);

        </script>
        <div style="margin: 20px">
            <table  data-toggle="tablefixed" data-width="100%" data-nowrap="true">
                <thead>
                <tr id="t1">
                    <g:each in="${tableHeadList}" status="j" var="headInstance">
                        <g:if test="${headInstance!='RN'}">
                            <th  width="125"><g:message code="${headInstance}" default="${headInstance}"/></th>
                        </g:if>
                    </g:each>
                </tr>
                </thead>
                <tbody>
                    <g:each in="${finalPassYieldByPart}" status="i" var="dataInstance">
                        <tr>
                            <g:each in="${tableHeadList}" status="j" var="headInstance">
                                <g:if test="${headInstance=='DEFECT_QTY'&&headInstance!='RN'}">
                                    <td name="FINALPASSBYPART${i}">${dataInstance["${headInstance}"]}</td>
                                </g:if>
                                <g:elseif test="${headInstance!='DEFECT_YIELD'&&headInstance!='RN'}">
                                    <td>${dataInstance["${headInstance}"]}</td>
                                </g:elseif>
                                <g:elseif test="${headInstance=='DEFECT_YIELD'}">
                                    <td>${dataInstance["${headInstance}"]}%</td>
                                </g:elseif>
                            </g:each>
                        </tr>
                    </g:each>
                    <tr>
                        <td colspan="2">小计</td>
                        <td name="finalPassYieldByPartShow"></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </g:if>
    <g:else>
        <g:render template="../template/emptyPanel" />
    </g:else>
</div>
%{--
<g:render template="../template/pagination" />--}%
<script>
    $(function(){
        var finalpassYieldByPart=0;
        for(var i=0;i<${finalPassYieldByPart.size()};i++){
            var finalpassyieldbypart='FINALPASSBYPART'+i
            var finalPassYieldByPartAdd=$("td[name='"+finalpassyieldbypart+"']").text()==''?0:parseInt($("td[name='"+finalpassyieldbypart+"']").text());
            finalpassYieldByPart+=finalPassYieldByPartAdd;

        }
        $("td[name='finalPassYieldByPartShow']").html(finalpassYieldByPart);
    })



</script>
